<%@ page language="java" import="java.util.*"
	contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
	ArrayList<String> jsPaths = (ArrayList<String>) request.getAttribute("jsPaths");
	jsPaths.add("/resources/bootstrap/table/jquery.dataTables.min.js");
	jsPaths.add("/resources/bootstrap/table/dataTables.bootstrap.js");
	jsPaths.add("/resources/custom/device/device.js");
	jsPaths.add("/resources/bootstrap/dynatree/jquery-ui.custom.js");
	jsPaths.add("/resources/bootstrap/dynatree/jquery.cookie.js");
	jsPaths.add("/resources/bootstrap/dynatree/jquery.dynatree.js");
	jsPaths.add("/resources/bootstrap/datePicker/moment.min.js");
	jsPaths.add("/resources/bootstrap/datePicker/bootstrap-datetimepicker.min.js");
	jsPaths.add("/resources/bootstrap/datePicker/bootstrap-datetimepicker.zh-CN.js");
	jsPaths.add("/resources/bootstrap/select/bootstrap-select.js");
%>
<div class="panel-group" id="accordion">
	<div class="panel panel-default">
		<div class="panel-heading">
			<h4 class="panel-title">
				<div data-toggle="collapse" data-toggle="collapse"
					data-parent="#accordion" href="#collapseOne"
					style="cursor: pointer;">
					<img alt=""
						src="${pageContext.request.contextPath}/resources/bootstrap/custom/search.png">
					&nbsp;搜索项目<span class="glyphicon glyphicon-chevron-down pull-right"
						id="arrow"></span>
				</div>
			</h4>
		</div>
		<div id="collapseOne" class="panel-collapse collapse">
			<div class="panel-body">
				<form role="form">
					<div class="row">
						<div class="form-group col-sm-4">
							<label for="searchProjectName" class="col-sm-4 control-label">项目名称:</label>
							<div class="col-sm-8">
								<input name="searchProjectName" id="searchProjectName"
									class="form-control" placeholder="项目名称">
							</div>
						</div>
						<div class="form-group col-sm-4">
							<label for="searchProjectName" class="col-sm-4 control-label">设备名称:</label>
							<div class="col-sm-8">
								<input name="searchName" id="searchName" placeholder="设备名称"
									class="form-control">
							</div>
						</div>
						<div class="form-group col-sm-4">
							<label for="searchProjectName" class="col-sm-4 control-label">设备标识:</label>
							<div class="col-sm-8">
								<input name="searchKey" id="searchKey" placeholder="设备标识"
									class="form-control">
							</div>
						</div>
					</div>
					<div class="row">
						<div class="form-group col-sm-4">
							<label for="searchType" class="col-sm-4 control-label">类型:</label>
							<div class="col-sm-8">
								<select name="searchType" id="searchType"
									class="form-control selectpicker">
									<option>ALL</option>
									<option>通断面积法A</option>
								</select>
							</div>
						</div>


						<div class="form-group col-sm-4">
							<label for="searchFormat" class="col-sm-4 control-label">数据格式:</label>
							<div class="col-sm-8">
								<select name="searchFormat" id="searchFormat"
									class="form-control selectpicker">
									<option>ALL</option>
									<option>WG-8010</option>


								</select>
							</div>
						</div>
						<div class="form-group col-sm-4">
							<label for="searchTime" class="col-sm-4 control-label">创建时间:</label>
							<div class="col-sm-8" id="timePicker">
								<input name="searchTime" id="searchTime" placeholder="创建时间"
									class="form-control">
							</div>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
</div>
<button class="btn btn-success btn-sm" data-toggle="modal"
	data-target="#myModal" id="addDevice">添加设备</button>
<div class="table-responsive">
	<table id="device"
		class="table table-striped table-bordered table-hover display"
		cellspacing="0" width="100%">
		<thead>
			<tr>
				<th>项目名称</th>
				<th>设备名称</th>
				<th>设备标识</th>
				<th>类型</th>
				<th>数据格式</th>
				<th>创建时间</th>
				<th>数据更新时间</th>
				<th>操作</th>
			</tr>
		</thead>
	</table>
</div>

<!-- add project dialog -->
<div class="modal fade" id="createDeviceModal" tabindex="-1"
	role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabel">设备</h4>
			</div>

			<form id="addForm" class="form-horizontal" role="form"
				action="${pageContext.request.contextPath}/device/create"
				method="post">
				<div class="modal-body">
					<div class="form-group">
						<label for="projectName" class="col-sm-3 control-label">项目名称</label>
						<div class="col-sm-9" id="treeFather">
							<input type='hidden' class="form-control" id="projectId"
								name="projectId"> <input type='text'
								class="form-control" id="projectName" name="projectName"
								placeholder="项目名称">
							<div id="tree" class="panel panel-primary tree"></div>
						</div>
					</div>
					<div class="form-group">
						<label for="key" class="col-sm-3 control-label">设备名称</label>
						<div class="col-sm-9">
							<input type="text" class="form-control" id="name" name="name"
								placeholder="设备名称">
						</div>
					</div>
					<div class="form-group">
						<label for="key" class="col-sm-3 control-label">设备标识</label>
						<div class="col-sm-9">
							<input type="text" class="form-control" id="key" name="key"
								placeholder="设备标识">
						</div>
					</div>
					<div class="form-group">
						<label for="type" class="col-sm-3 control-label">类型</label>
						<div class="col-sm-9">
							<select class="form-control selectpicker" id="type" name="type">
								<option>WG-8010</option>
							</select>
						</div>
					</div>
					<div class="form-group">
						<label for="format" class="col-sm-3 control-label">数据格式</label>
						<div class="col-sm-9">
							<select class="form-control selectpicker" id="format"
								name="format"><option>通断面积法A</option>
							</select>
						</div>
					</div>
					<div class="form-group">
						<label for="target" class="col-sm-3 control-label">用户名称</label>
						<div class="col-sm-9" id="treeFather">
							<input type='hidden' class="form-control" id="targetId"
								name="targetId">
							<textarea class="form-control" id="target" name="target" row='3'
								placeholder="用户名称"></textarea>
							<div id="treeTarget" class="panel panel-primary tree"></div>
						</div>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="submit" class="btn btn-primary">创建设备</button>
				</div>
			</form>
		</div>
	</div>
</div>
<!-- edit user dialog -->
<div class="modal fade" id="editDeviceModal" tabindex="-1" role="dialog"
	aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabel">编辑设备</h4>
			</div>

			<form id="editForm" class="form-horizontal" role="form"
				action="${pageContext.request.contextPath}/device/update"
				method="post">
				<div class="modal-body">
					<input type="hidden" id="idEdit" name="id"> <input
						type="hidden" id="projectIdEdit" name="projectId">
					<div class="form-group">
						<label for="projectNameEdit" class="col-sm-3 control-label">项目名称</label>
						<div class="col-sm-9" id="treeFather">
							<input type='text' class="form-control" id="projectNameEdit"
								name="projectName" placeholder="项目名称">
							<div id="treeEdit" class="panel panel-primary tree"></div>
						</div>
					</div>
					<div class="form-group">
						<label for="key" class="col-sm-3 control-label">设备名称</label>
						<div class="col-sm-9">
							<input type="text" class="form-control" id="nameEdit" name="name"
								placeholder="设备名称">
						</div>
					</div>
					<div class="form-group">
						<label for="key" class="col-sm-3 control-label">设备标识</label>
						<div class="col-sm-9">
							<input type="text" class="form-control" id="keyEdit" name="key"
								placeholder="设备标识">
						</div>
					</div>
					<div class="form-group">
						<label for="type" class="col-sm-3 control-label">类型</label>
						<div class="col-sm-9">
							<select class="form-control selectpicker" id="typeEdit"
								name="type">
								<option>WG-8010</option>
							</select>
						</div>
					</div>
					<div class="form-group">
						<label for="format" class="col-sm-3 control-label">数据格式</label>
						<div class="col-sm-9">
							<select class="form-control selectpicker" id="formatEdit"
								name="format">
								<option>通断面积法A</option>
							</select>
						</div>
					</div>
					<div class="form-group">
						<label for="target" class="col-sm-3 control-label">用户名称</label>
						<div class="col-sm-9" id="treeFather">
							<input type='hidden' class="form-control" id="targetIdEdit"
								name="targetId">
							<textarea row='3' class="form-control" id="targetEdit"
								name="target" placeholder="用户名称"></textarea>
							<div id="treeTargetEdit" class="panel panel-primary tree"></div>
						</div>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="submit" class="btn btn-primary">更新</button>
				</div>
			</form>
		</div>
	</div>
</div>
<!-- delete user dialog -->
<div class="modal fade" id="deleteDeviceModal">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">&times;</button>
				<h4 class="modal-title">删除用户</h4>
			</div>
			<div class="modal-body">
				<p>确定永久删除该条记录吗？</p>
			</div>
			<form class="form-horizontal" role="form"
				action="${pageContext.request.contextPath}/device/delete"
				method="post">
				<input type="hidden" class="form-control" id="idDelete" name="id">

				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="submit" class="btn btn-primary">删除</button>
				</div>
			</form>
		</div>
	</div>
</div>